<template>
  <div class="XinZeng">
    <el-form-item label="标题">
      <el-input
        v-model="sendData.title"
        type="text"
        placeholder="请输入通知标题"
      ></el-input>
    </el-form-item>
    <el-form-item label="内容">
      <el-input
        v-model="sendData.context"
        type="text"
        placeholder="请输入通知内容"
      ></el-input>
    </el-form-item>
    <el-form-item label="时间">
      <el-input v-model="sendData.time" type="text" placeholder="请输入时间">
        <div class="block">
          <span class="demonstration">With shortcuts</span>
          <el-date-picker
            v-model="value2"
            type="datetime"
            placeholder="Select date and time"
            :shortcuts="shortcuts"
          />
        </div>
      </el-input>
    </el-form-item>
    <el-form-item label="图片">
      <el-input
        v-model="sendData.img"
        type="text"
        placeholder="请输入图片链接"
      ></el-input>
    </el-form-item>
  </div>
</template>
  
  <script setup>
import {defineEmits,watch,reactive } from "vue";

const emits = defineEmits(["tongzhiData"]);

let title;
let context;
let time;
let img;

const sendData = reactive({
  title,
  context,
  time,
  img,
});
watch(sendData,()=>{
  emits("tongzhiData", sendData)
})


</script>
  
  <style lang="less" scoped>
.tianjia {
  padding: 30px 0;
}

.col {
  height: 38px;
}

.input {
  width: 200px;
}

.button {
  width: 70px;
  margin-left: 20px;
  margin-bottom: 30px;
}
</style>